<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>metaverse</title>
  <link rel="stylesheet" href="./css/main.css">
</head>

<body>
  <div id="app" v-cloak>
    <div class="tips">
      <p>角色控制: <br>
        【A】左移动<br>
        【W】前移动<br>
        【S】后移动<br>
        【D】右移动<br>
        <br>
        【鼠标滚轮】放缩视图 <br>
        【鼠标左键】按下旋转视图<br>
      </p>
    </div>

    <div class="dialog" v-show="showDialog.show">
      <h3>{{showDialog.data.name}}</h3>
      <br>
      <p>{{showDialog.data.desc}}</p>

      <a class="dialog-close" href="javascript:;" @click="showDialog.show = false">&times;</a>
    </div>
  </div>
  <script src="./script/vue.global.prod.js"></script>
  <script src="./script/three.min.js"></script>
  <script src="./script/OrbitControls.js"></script>
  <script src="./script/GLTFLoader.js"></script>
  <script src="./script/RGBELoader.js"></script>
  <script src="./script/PlayerControls.js"></script>
  <script src="./script/CSS2DRenderer.js"></script>

  <script src="./script/main.js"></script>
</body>

</html>